import React from 'react';

interface ThemeToggleProps {
  theme: string;
  onThemeChange: (theme: string) => void;
}

const ThemeToggle: React.FC<ThemeToggleProps> = ({ theme, onThemeChange }) => {
  return (
    <div className="p-4">
      <label htmlFor="theme-select" className={`mr-2 ${theme === 'dark' ? 'text-white' : 'text-black'}`}>主题颜色:</label>
      <select
        id="theme-select"
        value={theme}
        onChange={(e) => onThemeChange(e.target.value)}
        className={`p-2 rounded ${theme === 'dark' ? 'bg-gray-700 text-white' : 'bg-white text-black'}`}
      >
        <option value="default">亮色</option>
        <option value="dark">暗色</option>
      </select>
    </div>
  );
};

export default ThemeToggle;
